import React from 'react';
import {service} from "../service/service";
import {inject} from "../utils/inject_service";
import {observer} from "mobx-react";
import {message, Input, Table} from "antd";
import {Redirect} from "react-router";

import "antd/lib/message/style";
import "antd/lib/input/style";
import "antd/lib/table/style";

const { Search } = Input;

@inject({service})
@observer
export default class Query_result extends React.Component{
    state = {
      "data": [{"key":1}],
    };

    columns = [
        {
            title: '学号',
            dataIndex: 'stu_id',
            key: 'stu_id',
        },

        {
            title: '语文',
            dataIndex: 'chinese',
            key: 'chinese',
        },

        {
            title: '数学',
            dataIndex: 'math',
            key: 'math',
        },

        {
            title: '英语',
            dataIndex: 'english',
            key: 'english',
        },
    ];


    query(stu_id){
        this.props.service.query_result(this, stu_id);
    }

    stu_id_notexist(){
        message.info("你输入的学号不存在!")
    }

    input_error(){
        message.error("输入有误请重新输入!")
    }

    render(){
        if (this.props.service.login_status === false){
            message.info("请先登录!")
            return <Redirect to="/login" />
        }

        return (
            <div>
                <Search
                    placeholder="输入你要查询的学号"
                    enterButton="Search"
                    size="large"
                    onSearch={value => this.query.bind(this)(value)}
                    type="number"
                />
                <br/>
                <Table columns={this.columns} dataSource={this.state.data}/>
            </div>
        )
    }
}